<template>
  <div>
    <el-tabs v-model="activeName">
      <el-tab-pane label="发光文本" name="1">
        <stagger-glow-text></stagger-glow-text>
      </el-tab-pane>
      <el-tab-pane label="霓虹文本" name="2">
        <neon-text></neon-text>
      </el-tab-pane>
      <el-tab-pane label="3D跳跃" name="3">
        <bounce-threed v-if="activeName==='3'"></bounce-threed>
      </el-tab-pane>
      <el-tab-pane label="背景填充" name="4">
        <fill-text></fill-text>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
// 发光文本
import StaggerGlowText from './StaggerGlowText.vue'
// 霓虹文本
import NeonText from './NeonText.vue'
// 3d跳跃文本
import BounceThreed from './BounceThreed.vue'
// 背景填充文本
import FillText from './FillText'
export default {
  components: {
    StaggerGlowText,
    NeonText,
    BounceThreed,
    FillText
  },
  data() {
    return {
      activeName: '1'
    }
  }
}
</script>

